<!DOCTYPE HTML>

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org">
<head>
<title>Kukbuk - Zarządzanie przepisami</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<!-- Bootstrap CSS -->
<link rel="stylesheet" type="text/css"
	href="../../../../../css/bootstrap.min.css"
	th:href="@{/css/bootstrap.min.css}" />
<link rel="stylesheet" type="text/css"
	href="../../../../../css/custom.css" th:href="@{/css/custom.css}" />
</head>

<body>
	<!-- TOP MENU -->
	<div th:substituteby="template :: top-menu"></div>
	<!-- /TOP MENU -->

	<!-- MAIN CONTAINER -->
	<div class="container">
		<div class="row">
			<div class="page-header">
				<h1>Zarządzanie przepisami</h1>
			</div>
		</div>

		<!-- MESSAGE BOXES -->
		<div class="row" th:include="template :: message-boxes"></div>
		<!-- /MESSAGE BOXES -->


		<div class="row"
			th:if="${#bools.isFalse(recipes) or #lists.isEmpty(recipes)}">
			<h2>Brak przepisów</h2>
		</div>
		<!-- MY-RECIPES -->
		<div class="row"
			th:if="${#bools.isTrue(recipes) and not #lists.isEmpty(recipes)}">
			<table class="table">
				<thead>
					<tr>
						<th><h6>Kategoria</h6></th>
						<th><h6>Nazwa</h6></th>
						<th><h6>Opis</h6></th>
						<th><h6>Popularność</h6></th>
						<th><h6>Prywatny</h6></th>
						<th class="span3"></th>
					</tr>
				</thead>
				<tbody>
					<tr th:each="rec : ${recipes}">
						<td><a th:href="@{'/recipe/list/' + ${rec.category.id}}">
								<strong
								th:text="${beans.categoryService.getCategory(rec.category).name}">Nazwa
									kategorii</strong>
						</a></td>
						<td><a th:href="@{'/recipe/' + ${rec.id}}"> <strong
								th:text="${rec.name}">Nazwa przepisu</strong>
						</a></td>
						<td><em th:text="${rec.shortDescription}">Opis przepisu</em></td>
						<td>
							<div class="progress progress-striped active">
								<div class="bar" style="width: 90%;"
									th:style="${'width: ' + rec.votePercent + '%'}"
									th:text="${rec.positiveVoteCount + '/' + rec.negativeVoteCount}">90/10</div>
							</div>
						</td>
						<td><span th:text="${rec.isPrivate}? 'Tak' : 'Nie'">Tak</span></td>
						<td><a class="btn btn-primary"
							th:href="@{'/user/recipe/edit/' + ${rec.id}}"> <i
								class="icon-pencil icon-white"></i> Edytuj
						</a> <a class="btn btn-danger"
							th:href="@{'/user/recipe/delete/' + ${rec.id}}"> <i
								class="icon-remove icon-white"></i> Usuń
						</a></td>
					</tr>
				</tbody>
			</table>
		</div>
		<!-- /MY-RECIPES -->


	</div>
	<!-- /MAIN CONTAINER -->

	<!-- ======================================================== -->
	<!-- Scripts at bottom of page means faster loading times. -->
	<!-- Latest jQuery -->
	<script type="text/javascript"
		src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
	<!-- Bootstrap -->
	<script type="text/javascript" src="../../../../../js/bootstrap.min.js"
		th:src="@{/js/bootstrap.min.js}"></script>
</body>
</html>